/**
 * Created by Administrator on 2016/6/26.
 */
import React from 'react';

var scope;
export default class GoodsSpec extends React.Component {
    constructor(props){
        super(props);
        scope = this;
    };

    handleSpecChoose(index,price){
        scope.props.specChooseCallback({
            choosed_index : index,
            price : price
        });
    };

    render(){
        return (
            <div className="choose-box spec-box">
                <div className="choose-box-left">排量选择：</div>
                <div className="choose-box-right">
                    {this.specItems()}
                </div>
            </div>
        );
    };

    specItems(){
        var goodsArr = scope.props.data.goodsArr;
        var choosedIndex = scope.props.data.choosed_index
        var items = goodsArr.map(function (item,index) {
            var img_url = 'images/spec.png';
            var activeClass = '';
            if(choosedIndex == index){
                img_url = 'images/spec_choosed.png';
                activeClass = 'active';
            }
            return (
                <li className={activeClass} key={item.goods_id + '-spec'} onClick={scope.handleSpecChoose.bind(this,index,item.sale_price)}>
                    <img className="spec-img" src={img_url} />
                    <div className="spec-name">{item.spec_desc}</div>
                </li>
            );
        });

        return (
            <ul className="spec-list">{items}</ul>
        );
    };
};
